<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <title>开始测试</title>
    <link rel="stylesheet" type="text/css" href="css/style.css">
    <script type="text/javascript" src="js/fontSize.js"></script>
    <script type="text/javascript" src="js/zepto.min.js"></script>
    <script type="text/javascript" src="js/config.js?v=2"></script>
    <script type="text/javascript" src="js/vue.js"></script>
    <style type="text/css">
        .ruleImg{width: 3.56rem;display: block;margin:0 auto;}
        .rules_list{margin-top: .87rem;}
        .rules_list li{margin-bottom: .18rem;overflow: hidden;}
        .rules_list span{color: #fff;display: inline-block;width: .33rem;height: .33rem;line-height: .34rem;border-radius: 50%;background: #fb597b;float: left;font-size: .24rem;text-align: center;margin:0 .28rem 0 .5rem;position: relative;top: 0.06rem;}
        .rules_list div{width: 5.9rem;float: left;color: #666666;font-size: .3rem;line-height: .5rem;}
        .begin{font-size: .32rem;color: #ffffff;width: 2.47rem;height: .85rem;text-align: center;border-radius:.1rem;background: #fb597b;display: block;margin:2.5rem auto .1rem;}
    </style>
</head>
<body>
    <div id="app">
        <div style="height:.75rem;"></div>
        <img src="img/p_60.png" alt="" class="ruleImg">
        <ul class="rules_list">
            <li v-for="(item,index) in rules">
                <span>{{index+1}}</span>
                <div>{{item.rule}}</div>
            </li>
            <!-- <li>
                <span>2</span>
                <div>回答时间越快得分越高</div>
            </li>
            <li>
                <span>3</span>
                <div>若时间为0时还没有答题，则自动跳过此题，且不计分</div>
            </li>
            <li>
                <span>4</span>
                <div>答错或不回答的题记0分</div>
            </li> -->
        </ul>
        <button type="button" class="begin" @click="goNext">开始答题</button>
    </div>
    <script type="text/javascript">
         var app = new Vue({
            el: '#app',
            data: {
                unionid:GetQueryString("unionid"),
                mistakes:[],
                id:GetQueryString("id"),
                rules:[]

            },
            mounted(){
             hideMenu();
             this.getRule();
                 
            },
            methods: {
                goNext:function(){
                    window.location.replace(mainUrl+"/questions.html?id="+this.id+"&unionid="+this.unionid);
                },
                getRule:function(){
                  var that=this;
                  ajaxFun("POST","/get_rule",{
                     q_id:this.id
                  },function(data){
                       var res=data;
                      if(res.code==1){
                         that.rules=res.data.rule;  
                      }else{

                      }
                              
                  });
                }

            }
        })
    </script>
     
</body>
</html>